*{
	padding: 0px;
	margin:0px;
}

body{
	background: #484848;
}

audio
{
	display: none;
}

.start{
	background: url(../image/developing.png);
	width: 429px;
	height:53px;
	position: relative;
	top: -65px;
	left: -455px;

	animation:myfirst_start 3s;
	animation-delay:0s;/*延迟时间*/
}
.table{
	background: url(../image/background.jpg);
	width: 620px;
	height: 460px;
	margin:0 auto;
	margin-top: 100px;
	padding: 10px;
	overflow: hidden;
}

.table_top{
	width: 100%;
	height: 30px;
}

.top_left_img{
	width: 100px;
	height: 60px;
	float: left;
}

.top_left_img img{
	float: left;
}

.top_left_img h1{
	color: #FD9E20;
	float: left;
	margin-left: 10px;
}

.top_left_img p{
	float: left;
	color: #AF7607;
}

.top_left_right{
	width: 100px;
	height: 60px;
	float: right;
}

.apple{
	background: url(../image/apple.png);
	width: 66px;
	height: 66px;
	position: relative;
	top:483px;
	left: 106px;
	/*animation:myfirst 2s infinite;*/
	transform: rotate(45deg);
	animation:myfirst 3s;
	animation-delay:3s;/*延迟时间*/
	transform-origin:center;
}

.banana{
	background: url(../image/banana.png);
	width: 126px;
	height: 50px;
	position: relative;
	top:483px;
	left: 106px;
	
	transform: rotate(45deg);
	animation:myfirst 3s;
	animation-delay:6s;/*延迟时间*/
	transform-origin:center;
	
	
}

.peach{
	background: url(../image/peach.png);
	width: 62px;
	height: 59px;
	position: relative;
	top:483px;
	left: 106px;
	
	transform: rotate(45deg);
	animation:myfirst 3s;
	animation-delay:9s;/*延迟时间*/
	transform-origin:center;
	
}

.sandia{
	background: url(../image/sandia.png);
	width: 98px;
	height: 85px;
	position: relative;
	top:483px;
	left: 106px;
	
	transform: rotate(45deg);
	animation:myfirst 3s;
	animation-delay:6s;/*延迟时间*/
	transform-origin:center;
	
}

.over{
	background: url(../image/game-over.png);
	width: 1px;
	height:1px;
	margin-left: 70px;
	margin-top: -50px;

	transform: rotate(0deg);
	animation:myfirst_over 3s;
	animation-delay:12s;/*延迟时间*/
	transform-origin:center;
	animation-fill-mode:forwards;
}



@keyframes myfirst
{
	0%{
		top: 483px;
		left: 106px;
		transform: rotate(360deg);
	}

	50%{
		top: 133px;
		left: 226px;
		transform: rotate(720deg);
	}
	100%{
		top: 550px;
		left: 366px;
		transform: rotate(1040deg);
	}
}


@keyframes myfirst_over
{
	0%{

		width: 1px;
		height: 1px;
	}

	100%{
		width: 490px;
		height: 85px;
		transform: rotate(360deg);
	}
}


@keyframes myfirst_start
{
	0%{

		top: -65px;
		left: -455px;
	}

	50%{
		top: -65px;
		left: 100px;
	}

	100%{
		top: -65px;
		left: 642px;

	}
}